<template>
  <div>
    <div class="feedback">
      <textarea placeholder="欢迎您在此填写宝贵意见" ref="content"></textarea>
    </div>
    <footer class="form-footer fixed-footer">
      <button class="return hairlines-top" @click="back"><i class="iconfont icon-return2"></i>返回</button>
      <input class="next" type="button" value="提交" @click="submit">
    </footer>
  </div>
</template>
<script>
  import $ from 'edom'
  export default {
    name: 'feedback',
    data () {
      return {
        title: '意见反馈'
      }
    },
    methods: {
      back () {
        this.$router.go(-1)
      },
      submit (event) {
        let target = event.target
        let textEle = this.$refs.content
        let value = textEle.value
        target.setAttribute('disabled', 'disabled')
        if (!value) {
          $().Mnews('请填写内容', 1000)
        } else {
          this.axios.post('/api/user/feedback', {
            user_id: this.$store.user_id,
            content: value
          })
          .then(function (res) {
            let data = res.data
            let desc = data.desc
            textEle.value = ''
            $().Mnews(desc, 1000)
          })
          .catch(function (err) {
            $().Mnews(err, 1000)
            target.removeAttribute('disabled')
          })
        }
      }
    },
    created () {
      this.setTitle(this.title)
    }
  }
</script>
<style lang="scss" scoped>
  @import '../../assets/css/function.scss';
  .feedback{
    padding: rem(25) rem(24);
    textarea{
      display: block;
      padding: rem(15) rem(10);
      width: 100%;
      height: rem(455);
      font-size: rem(28);
      color: #333;
      resize: none;
    }
  }
</style>
